<h5>四列 , 行两个项目</h5>
<div class="row data-type">

    <div class="col-md-2 title">订单编号</div>
    <div class="col-md-4 data text">
        xxxxxxx
    </div>

    <div class="col-md-2 title">下单时间</div>
    <div class="col-md-4 data text">
        2019-01-01
    </div>

    <div class="col-md-2 title">路线名称</div>
    <div class="col-md-4 data text">
        xxxxxxx
    </div>

    <div class="col-md-2 title">出发城市</div>
    <div class="col-md-4 data text">
        北京
    </div>

    <div class="col-md-2 title">其他信息</div>
    <div class="col-md-10 data text">
        aaadfsdfdsfsdfdsa
    </div>

    <div class="col-md-2 title rowHeight2x">高度2x</div>
    <div class="col-md-10 data rowHeight2x">
        <textarea class="form-control" rows="3" placeholder="请输入..." disabled ></textarea>
    </div>

</div>


<h5>三列</h5>
<div class="row data-type">
    <!--单行数据显示 非表格-->
    <div class="col-md-2 title item-green rowHeight2x"><i class="glyphicon glyphicon-yen"></i> 销量</div>
    <div class="col-md-5 data rowHeight2x border-right">
        <div class="line">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 下单金额1</div>
            <div class="pull-right">307,02120</div>
        </div>
        <div class="line">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 下单金额2</div>
            <div class="pull-right"><span class="arrowup"><i class="glyphicon glyphicon-arrow-up"></i>2.66%</span></div>
        </div>
    </div>
    <div class="col-md-5 data rowHeight2x">
        <div class="line">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 下单客户数</div>
            <div class="pull-right">37,02120</div>
        </div>
        <div class="line">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 下单金额</div>
            <div class="pull-right"><span class="arrowdown"><i class="glyphicon glyphicon-arrow-down"></i>3.16%</span></div>
        </div>
    </div>
</div>




<h5>两列、三列、四列</h5>
<div class="row data-type">
    <div class="col-md-2 title item-orange"><i class="glyphicon glyphicon-retweet"></i> 转化</div>
    <div class="col-md-5 data text border-right">
        <div class="pull-left">
            <i class="glyphicon glyphicon-question-sign"></i> 店铺成交转化率</div>
        <div class="pull-right">2.25%</div>
    </div>
    <div class="col-md-5 data text">
        <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 先取付款率</div>
        <div class="pull-right">88.52%</div>
    </div>
</div>




<div class="row data-type">
    <div class="col-md-2 title item-red"><i class="glyphicon glyphicon-heart"></i> 回访</div>
    <div class="col-md-5 data text border-right">
        <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 30日客户回头率</div>
        <div class="pull-right">1.95%</div>
    </div>
    <div class="col-md-5 data text">
        <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 30日重复购买率</div>
        <div class="pull-right">1.97%</div>
    </div>
</div>

<div class="row data-type">
    <div class="col-md-2 title item-blue"><i class="glyphicon glyphicon-circle-arrow-up"></i> 上架</div>
    <div class="col-md-10 padding-clear">
        <div class="col-md-4 data text border-right">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 上架商品数量(SKU)</div>
            <div class="pull-right">32</div>
        </div>
        <div class="col-md-4 data text border-right">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 上架商品数量(SKU)</div>
            <div class="pull-right">28</div>
        </div>
        <div class="col-md-4 data text">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 上架商品数量(SKU)</div>
            <div class="pull-right">28</div>
        </div>
    </div>
</div>

<div class="row data-type">
    <div class="col-md-2 title item-blue"><i class="glyphicon glyphicon-signal"></i> 流量</div>
    <div class="col-md-10 padding-clear">
        <div class="col-md-3 data text border-right">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 浏览量</div>
            <div class="pull-right">62,02120</div>
        </div>
        <div class="col-md-3 data text border-right">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 浏览量</div>
            <div class="pull-right">62,02120</div>
        </div>
        <div class="col-md-3 data text border-right">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 浏览量</div>
            <div class="pull-right">62,02120</div>
        </div>
        <div class="col-md-3 data text">
            <div class="pull-left"><i class="glyphicon glyphicon-question-sign"></i> 浏览量</div>
            <div class="pull-right">62,02120</div>
        </div>
    </div>
</div>
